import { defineStore } from 'pinia';
import { computed, ref } from 'vue';

// 1.Option写法: 定义一个 money 存储单元
// export const useMoneyStore = defineStore('money', {
//   state: () => ({ money: 100 }),
//   getters: {
//     rmb: (state) => state.money,
//     usd: (state) => state.money * 0.14,
//     eur: (state) => state.money * 0.13,
//   },
//   actions: {
//     win(arg) {
//       this.money += arg;
//     },
//     pay(arg) {
//       this.money -= arg;
//     },
//   },
// });


// 2.Setup写法: 定义一个 money 存储单元(我们可以传入一个函数, 该函数定义了一些响应式属性和方法, 并且返回一个带有我们想暴露出去的属性和方法的对象)
export const useMoneyStore = defineStore('money', () => {
  // 在Setup Store中, ref()就是state
  const money = ref(100);

  // 在Setup Store中, computed()就是getters
  const rmb = computed(() => money.value);
  const usd = computed(() => money.value * 0.14);
  const eur = computed(() => money.value * 0.13);

  // 在Setup Store中, function()就是actions
  const win = (arg) => {
    money.value += arg;
  };
  const pay = (arg) => {
    money.value -= arg;
  };

  return {money, rmb, usd, eur, win, pay};
});